import React, { Component,Fragment } from 'react';

import { NavLink} from "react-router-dom"
import '../../styles/city/city_x.css'
// import Home from '../../views/home'
import {get_cityinfo,get_search_d} from '../../api'
class City_x extends Component {
  constructor(){
    super()
    this.state={
      loacl_c:'',
      val:''
    }
  }
  componentWillMount(){
    // console.log(this.props.match.params.did)
    get_cityinfo(this.props.match.params.did)
    .then(res=>{
      // console.log(res.data.name)
      this.setState({
        loacl_c:res.data.name,
        search_dress:[]
      })
    })
  }
  toback(){
    console.log(233)
  }
  tosearch(){
    get_search_d(this.props.match.params.did,this.state.val)
    .then(res=>{
      this.setState({
        search_dress:res.data
      })
    })
  }
  changet(e){
    // console.log(e.target.value)
    this.setState({
      val:e.target.value
    })
  }
  tohome(){
    this.props.history.goBack()
  }
  toto(aa){
    this.props.history.push('/home',{d_info:aa})
  }
    render() {
      let list_d=this.state.search_dress
      let search_info
      if(list_d==false||list_d==null||list_d.length==0){
        search_info=(<li>很抱歉！没有搜索结果</li>)
      }else{
        console.log(list_d)
        search_info=list_d.map((val,ind)=>{
          return (
            <li key={ind} onClick={this.toto.bind(this,val.address)}>
              <h4>{val.name}</h4>
              <p>{val.address}</p>
            </li>
          )
        })
      }
      
      return (
       <Fragment>
           <div className='header_c'>
                <NavLink to='/dress'>
                    <i className="iconfont icon-fanhui-yuanshijituantubiao" style={{fontSize:"0.5rem"}} onClick={this.tohome.bind(this)}></i>
                </NavLink>
                <h3>
                    {this.state.loacl_c}
                </h3>
                <NavLink to='/dress'>
                    <span>切换地址</span>
                </NavLink>
            </div>
            <div className='from_c'>
              <input type="text" placeholder='输入学校、商务楼、地址' value={this.state.val} onChange={this.changet.bind(this)}/>
              <button onClick={this.tosearch.bind(this)}>提交</button>
            </div>
            <div>
              <ul className='search_d'>
                {search_info}
              </ul>
            </div>
       </Fragment>
      );
    }
  }
  export default City_x